<section class="setup-box js-signup-box fade-in">
    <div class="vertical">
        <form id="signup" class="setup-form" method="post" novalidate="novalidate">

            {{!-- Horrible hack to prevent Chrome from incorrectly auto-filling inputs --}}
            <input style="display:none;" type="text" name="fakeusernameremembered"/>
            <input style="display:none;" type="password" name="fakepasswordremembered"/>

            <header>
                <h1>Welcome to Ghost</h1>
                <h2>Create your account to start publishing</h2>
            </header>
            <div class="form-group">
                <label for="email">Email Address</label>
                {{input type="email" name="email" autocorrect="off" value=model.email }}
                <p>Used for important notifications</p>
            </div>
            <div class="form-group">
                <label for="name">Full Name</label>
                {{gh-trim-focus-input type="text" name="name" autofocus="autofocus" autocorrect="off" value=model.name }}
                <p>The name that you will sign your posts with</p>
            </div>
            <div class="form-group">
                <label for="password">Password</label>
                {{input type="password" name="password" autofocus="autofocus" autocorrect="off" value=model.password }}
                <p>Must be at least 8 characters</p>
            </div>
            <footer>
                <button type="submit" class="btn btn-green btn-lg" {{action "signup"}} {{bind-attr disabled=submitting}}>Create Account</button>
            </footer>
        </form>
    </div>
</section>
